// 操作日志
<template>
  <el-row class="drugStorage-body">
    <!-- <el-col :span="24">
       <TopManu></TopManu>
     </el-col>-->
    <el-col :span='24' styl="margin-top:20px;padding:0 20px;" class="drugStorage-content">
      <el-form :inline="true" class="demo-form-inline" v-model="formInline" style='marginTop:20px;'>
        <el-form-item label="操作">
          <el-input placeholder="请输入操作内容" v-model="formInline.action">
          </el-input>
        </el-form-item>
        <el-form-item label="操作人">
          <el-input placeholder="请选择操作人" v-model="formInline.user">
          </el-input>
        </el-form-item>
        <!-- <el-form-item label="所在科室">
          <el-input placeholder="请选择部门科室" v-model="formInline.dept">
          </el-input>
        </el-form-item> -->
        <el-form-item label="事件状态">
          <el-select v-model="formInline.success_status" placeholder="">
            <el-option label="全部" value="0"></el-option>
            <el-option label="成功" value="1"></el-option>
            <el-option label="失败" value="2"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="操作时间">
          <el-date-picker
            v-model="formInline.created_at"
            type="datetimerange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
    
      value-format="yyyy-MM-dd HH:mm:ss"
          >
          </el-date-picker>

        
        </el-form-item>

        <el-form-item>
          <el-button type="primary" @click="()=>{tableData = [],getIndex()}">查询</el-button>
        </el-form-item>

        <el-form-item>
          <el-button type="danger" @click="reset">重置</el-button>
        </el-form-item>
      </el-form>
      <FromList :tableTitle="patientTitle" :tableData="listData"/>
      <div style="marginTop:10px;width:100%;">
         <el-col :span="24" class="flexPagination" style="marginTop:auto;display:flex;">
            <el-pagination
            background
            @size-change="handleSizeChange"
            :current-page="page"
            :page-sizes="[10, 20, 30, 100]"
            :page-size="limit"
            layout="sizes , total , prev, pager, next , jumper"
            @current-change="handlePagination"
            :total="userCount">
            </el-pagination>
          </el-col>
      </div>
    </el-col>
  </el-row>
</template>

<script>
import FromList from "@/forComponents/fromList/fromList"
import TopManu from "@/components/TopMenu"
import ViewTitle from "@/forComponents/viewTitle"
import {getList, exportFile} from "@/api/operationLog"

export default {
  name:"operationLog",
  data() {
    return {
      activity: 1,
      leftValue: "",
      page:1,
      limit:10,
      formInline: {
        action: "",
        user: "",
        dept: "",
        success_status: "",
        created_at: ["",'']
      },
      patientTitle:
        [
          {
            prop: "index",
            name: "序号",
            type: 1,
            width: 50
          },
          {
            prop: "module",
            name: "所属模块",
            type: 1,
          },
          {
            prop: "operation_action",
            name: "操作",
            type: 1,
          },
          {
            prop: "operation_info",
            name: "操作内容",
            type: 1,
          },
          {
            prop: "user",
            name: "操作人",
            type: 1,
          },
          {
            prop: "dept",
            name: "所在科室",
            type: 1,
          },
          {
            prop: "success_status",
            name: "操作状态",
            type: 6,
          },
          {
            prop: "created_at",
            name: "操作时间",
            type: 1,
          },
      ],
      listData:
        [
          {
            index: "",
            operation_action: "",
            operation_info: "",
            user: "",
            dept: "",
            success_staus: "",
            created_at: ["",'']
          }
      ],
      userCount:0,
    }
  },
  components: {
    FromList,
    TopManu,
    ViewTitle
  },
  mounted() {
    this.getIndex()
  },
  methods: {
    reset(){
      this.page = 0
      this.limit = 5
      // Object.keys(this.formInline).forEach(key=>{
      //   this.$set(this.formInline,key,"")
      // })
      this.getIndex()
    },
    getIndex() {
      var data=this.formInline
      data.page=this.page
      data.limit=this.limit
      console.log( data.created_at)
      if(this.formInline.created_at[0]==''||this.formInline.created_at[0]==undefined){
        data.created_at=''
      }else{
      data.created_at=this.formInline.created_at[0]+"|"+this.formInline.created_at[1]

      }
        getList(data).then(res => {
        let data = res.data.list
        data.forEach((item,index) =>{
          item.index = index + 1
          item.user = item.user ? item.user.real_name : ''
          item.dept = item.dept ? item.dept.name : ''
          item.success_status = item.success_status == 1 ? '成功' : '失败'
        });
        this.userCount = res.data.count
        this.listData = data
      }).catch()
    },
    handleSizeChange(e){
      this.limit = e
      this.getIndex()
    },
    handlePagination(e){
      this.page = e
      this.getIndex()
    },

  }
}
</script>

<style lang="scss" scoped>
@import "./index.scss";
.flexPagination{
  justify-content: center;
}
</style>
